<template>
  <div class="home-wrap">
    <el-dialog :visible.sync="dialogVisible.show" center>
      <el-form :inline="true" :model="ruleform" ref="from" :rules="rules">
        <div class="con">
          <el-form-item label="名称" prop="api_name">
            <el-input
              v-model="ruleform.api_name"
              autocomplete="off"
              disabled
            ></el-input>
          </el-form-item>
          <br />
          <el-form-item label="类型" prop="need_token">
            <el-radio-group v-model="ruleform.need_token">
              <el-radio label="0">无需登录</el-radio>
              <el-radio label="1">需要登录</el-radio>
            </el-radio-group>
          </el-form-item>
          <br />
          <el-form-item label="时间戳" prop="ts_filter">
            <el-radio-group v-model="ruleform.ts_filter">
              <el-radio label="0">不校验</el-radio>
              <el-radio label="1">校验</el-radio>
            </el-radio-group>
          </el-form-item>
          <br />
          <el-form-item label="调试日志" prop="log_debug_level">
            <el-checkbox-group v-model="ruleform.log_debug_level">
              <el-checkbox label="1" value="1">请求</el-checkbox>
              <el-checkbox label="2" value="2">响应</el-checkbox>
              <el-checkbox label="3" value="3">处理中</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <br />
          <el-form-item label="并发" prop="max_cc">
            <el-input
              v-model="ruleform.max_cc"
              autocomplete="off"
              placeholder="请输入并发数"
            ></el-input>
          </el-form-item>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitModify('from')"
              >修改</el-button
            >
            <el-button type="warning" plain @click="onReset('from')"
              >重置</el-button
            >
          </div>
        </div>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { getData, postData } from "@/request/http";
export default {
  name: "audit",
  props: {
    api_name_check: {
      type: String,
      default: "",
    },
    dialogVisible: {
      type: Object,
      default() {
        return {
          show: false,
        };
      },
    },
  },
  data() {
    return {
      ruleform: {
        api_name: "",
        need_token: "",
        ts_filter: "",
        log_debug_level: [],
        max_cc: "",
      },
      rules: {
        api_name: [{ required: false, message: "", trigger: "blur" }],
        need_token: [
          { required: false, message: "请选择类型", trigger: "blur" },
        ],
        ts_filter: [
          {
            required: false,
            message: "校验签名时是否校验时间戳",
            trigger: "blur",
          },
        ],
        log_debug_level: [
          {
            type: "array",
            required: false,
            message: "请选择API调试日志",
            trigger: "blur",
          },
        ],
        max_cc: [{ required: false, message: "请输入并发数", trigger: "blur" }],
      },
    };
  },
  watch: {
    api_name_check: {
      handler(newVal) {
        this.ruleform.api_name = newVal;
        this.initShow();
      },
      immediate: true,
    },
  },
  mounted() {
    // this.initShow();
  },
  methods: {
    //初始的时候显示,
    initShow() {
      postData("/adminweb/api/get", {
        api_name: this.api_name_check,
      })
        .then((res) => {
          var arr = [];
          console.log(res);
          if (res.code == 0) {
            let api_detail = res.datas;
            this.ruleform.api_name = api_detail.api_name;
            this.ruleform.max_cc = api_detail.max_cc;
            this.ruleform.need_token = JSON.stringify(api_detail.need_token);
            this.ruleform.ts_filter = JSON.stringify(api_detail.ts_filter); 

            //初始勾选
            let log_debug_level_arr = eval(api_detail.log_debug_level)
            for (var i = 0; i < log_debug_level_arr.length; i++) {
                arr.push(JSON.stringify(log_debug_level_arr[i]));
            }
            this.$set(this.ruleform, "log_debug_level", arr);
          } else if (res.code == -56055) {
            return;
          } else {
            this.$message.error(res.code + "，" + res.msg);
          }
        })
        .catch((res) => {
          this.$message.error(res.code + "，" + res.msg);
        });
    },
    //添加 提交
    submitModify(formName) {
      var that = this;
    //   console.log(that.ruleform.log_debug_level);
      let log_debug_level = that.ruleform.log_debug_level;
      let log_debug_level_arr = [];
      for (var i = 0; i < log_debug_level.length; i++) {
        log_debug_level_arr.push(Number(log_debug_level[i]));
      }
      that.$refs[formName].validate((valid) => {
        if (valid) {
          postData("/adminweb/api/update", {
            api_name: that.ruleform.api_name,
            need_token: that.ruleform.need_token,
            ts_filter: that.ruleform.ts_filter,
            log_debug_level: log_debug_level_arr,
            max_cc: that.ruleform.max_cc,
          })
            .then((res) => {
              if (res.code == 0) {
                that.$message.success("修改成功！");
                that.$emit("refresh");
              } else {
                that.$message.error(res.code + "，" + res.msg);
              }
            })
            .catch((res) => {
              that.$message.error(res.code + "，" + res.msg);
            });
        } else {
          that.$message.error("修改失败");
          return false;
        }
      });
    },
    // 重置
    onReset(val) {
      //this.$emit("reset", true);
      this.$refs[val].resetFields();
    },
  },
};
</script>

<style scoped>
.home-wrap >>> .el-dialog {
  width: 30%;
}
.home-wrap >>> .el-dialog--center .el-dialog__body {
  padding: 20px !important;
  height: 460px !important;
}
.home-wrap >>> .el-dialog {
  margin-top: 30vh !important;
}
</style>
